<template>
  <div class="task-info-project">
    <el-scrollbar>
      <ul class="info-list">
        <li>
          <span class="tit">项目阶段</span>
          <el-select v-model="detail.stageId" disabled>
            <el-option v-for="item in getDict('projectStage')" :key="item.id" :label="item.name" :value="item.id" />
          </el-select>
        </li>
        <li>
          <span class="tit">优先级</span>
          <el-select v-model="detail.priorityId" @change="() => editChange(detail)">
            <el-option v-for="item in getDict('taskPriorityId')" :key="item.id" :label="item.name" :value="item.id" />
          </el-select>
        </li>
        <li>
          <span class="tit">实际开始时间</span>
          <el-date-picker
            v-model="detail.startTime"
            format="YYYY-MM-DD"
            value-format="YYYY-MM-DD HH:mm:ss"
            @change="() => editChange(detail)"
          ></el-date-picker>
        </li>
        <li>
          <span class="tit">实际结束时间</span>
          <el-date-picker
            v-model="detail.endTime"
            format="YYYY-MM-DD"
            value-format="YYYY-MM-DD HH:mm:ss"
            @change="() => editChange(detail)"
          ></el-date-picker>
        </li>
      </ul>
      <div class="desc">
        <span class="tit">任务描述</span>
        <el-input
          v-model="detail.description"
          style="min-height: 30vh"
          type="textarea"
          @change="() => editChange(detail)"
        ></el-input>
      </div>
    </el-scrollbar>
  </div>
</template>
<script lang="ts" setup>
import { onMounted, inject } from "vue";
import { useDict } from "@/hooks/useDict";
import { ElMessage } from "element-plus";
//api
import { updateProjectTask } from "@/api/modules/project";
// hooks
const { getDict } = useDict(["projectStage", "taskPriorityId"]);
// inject
const refresh = inject("refresh");
const detail = inject("detail");
// 变量

// 方法
const editChange = async params => {
  try {
    await updateProjectTask({
      id: params.id,
      remark: params.remark,
      parentId: params.parentId,
      projectId: params.projectId,
      projectName: params.projectName,
      code: params.code,
      name: params.name,
      description: params.description,
      userId: params.userId,
      userName: params.userName,
      priorityId: params.priorityId,
      planStartTime: params.planStartTime,
      planEndTime: params.planEndTime,
      startTime: params.startTime,
      endTime: params.endTime,
      stageId: params.stageId,
      markerId: params.markerId,
      status: params.status
    });
    ElMessage.success("修改成功");
    refresh();
  } catch (e) {
    console.log(e);
  }
};
onMounted(() => {});
</script>
<style lang="scss">
.task-info-project {
  display: flex;
  height: 100%;
  padding: 0 30px;
  font-size: 14px;
  color: #333333;
  .info-list {
    display: flex;
    gap: 60px;
    li {
      display: flex;
      flex-flow: column nowrap;
      gap: 10px;
    }
  }
  .desc {
    display: flex;
    flex-flow: column nowrap;
    gap: 10px;
    margin-top: 30px;
    .el-textarea__inner {
      min-height: 30vh !important;
    }
  }
}
</style>
